<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
<script type="text/javascript" src="../js/jquery-3.2.1.js"></script>
<script type="text/javascript">
	$(function() {
		$("#submit").click(function() {
			$.ajax({
				url : 'updateById.do',
				data : $("form").serialize(),
				dataType : 'text',
				success : function(data, textStatus) {
					alert(data);
				}
			});
		});
	});
	function deleteById(id) {
		$.ajax({
			url : 'deleteById.do',
			data : {
				id : id
			},
			dataType : 'text',
			success : function(data, textStatus) {
				window.location.reload();
				alert(data);
			}
		});
	}
	function update(id) {
		$.ajax({
			url : 'updateById.do',
			data : $("#form" + id).serialize(),
			dataType : 'text',
			success : function(data, textStatus) {
				alert(data);
				window.location.reload();
			}
		});
	}
	function add(){
		$.ajax({
			url:'save.do',
			data:$("#form_add").serialize(),
			dataType:'text',
			success:function(data, textStatus){
				alert(data);
				window.location.reload();
			}});
	}
</script>
</head>
<body>
	<br>
	<table>
		<thead>
			<tr>
				<th>id</th>
				<th>姓名</th>
				<th>密码</th>
				<th>邮箱</th>
				<th>操作</th>
			</tr>
		</thead>

		<c:forEach var="user" items="${userList}">
			<tr>
				<form id="form${user.userId}">
					<input type="hidden" name="userId" value="${user.userId}" />
				<td>${user.userId}</td>
				<td><input type="text" name="userName" value="${user.userName}" /></td>
				<td><input type="text" name="userPassword"
					value="${user.userPassword}" /></td>
				<td><input type="text" name="userEmail"
					value="${user.userEmail}" /></td>
				<td><button type="button" onclick="deleteById('${user.userId}')">删除</button>
					<button type="button" onclick="update('${user.userId}')">修改</button></td>
				</form>
			</tr>
		</c:forEach>
		<tr>
				<form id="form_add">
				<td>--</td>
				<td><input type="text" name="userName" value="${user.userName}" /></td>
				<td><input type="text" name="userPassword"
					value="${user.userPassword}" /></td>
				<td><input type="text" name="userEmail"
					value="${user.userEmail}" /></td>
				<td>
					<button type="button" onclick="add()">添加</button></td>
				</form>
			</tr>
		<tfoot>
			<tr>
				<td colspan="5">第&nbsp;${pageNo}&nbsp;页&nbsp;&nbsp;共${totalPage}页</td>
			</tr>
		</tfoot>
	</table>
</body>
</html>
